<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>

<body>
    <script>
        var arr = [{
            "id": "10",
            "tx_type": "0",
            "tx_number": "1",
            "tx_image_name": "X3",
            "tx_image_url": "https://biangene.oss-cn-shenzhen.aliyuncs.com/tx/1162/0/b4673a20-2db3-11e8-acd5-1ba740221674.png",
            "tx_create_time": "2018-03-22 17:28:20.0"
        }, {
            "id": "11",
            "tx_type": "0",
            "tx_number": "1",
            "tx_image_name": "X4",
            "tx_image_url": "https://biangene.oss-cn-shenzhen.aliyuncs.com/tx/1162/0/b4959d20-2db3-11e8-ab39-cb1532651d24.png",
            "tx_create_time": "2018-03-22 17:28:20.0"
        }, {
            "id": "8",
            "tx_type": "0",
            "tx_number": "1",
            "tx_image_name": "X1",
            "tx_image_url": "https://biangene.oss-cn-shenzhen.aliyuncs.com/tx/1162/0/b3fc1c40-2db3-11e8-bf46-df5ac21b397d.png",
            "tx_create_time": "2018-03-23 17:28:19.0"
        }, {
            "id": "8",
            "tx_type": "0",
            "tx_number": "1",
            "tx_image_name": "X1",
            "tx_image_url": "https://biangene.oss-cn-shenzhen.aliyuncs.com/tx/1162/0/b3fc1c40-2db3-11e8-bf46-df5ac21b397d.png",
            "tx_create_time": "2018-03-23 17:28:19.0"
        }, {
            "id": "9",
            "tx_type": "0",
            "tx_number": "1",
            "tx_image_name": "X2",
            "tx_image_url": "https://biangene.oss-cn-shenzhen.aliyuncs.com/tx/1162/0/b4450c20-2db3-11e8-b0c9-b75372e41737.png",
            "tx_create_time": "2018-03-21 17:28:19.0"
        }, {
            "id": "9",
            "tx_type": "0",
            "tx_number": "1",
            "tx_image_name": "X2",
            "tx_image_url": "https://biangene.oss-cn-shenzhen.aliyuncs.com/tx/1162/0/b4450c20-2db3-11e8-b0c9-b75372e41737.png",
            "tx_create_time": "2018-03-29 17:28:19.0"
        }]

        function mapLoction(arr) {
            var newArr = [];
            arr.forEach(function (oldData, i) {
                var index = -1;
                var createTime = oldData.tx_create_time.substring(0, 10);
                var alreadyExists = newArr.some(function (newData, j) {
                    if (oldData.tx_create_time.substring(0, 10) === newData.tx_create_time.substring(
                            0, 10)) {
                        index = j;
                        return true;
                    }
                });
                if (!alreadyExists) {
                    newArr.push({
                        tx_create_time: oldData.tx_create_time,
                        res: [{
                            "tx_create_time": oldData.tx_create_time,
                            "tx_image_url": oldData.tx_image_url,
                            "tx_image_name": oldData.tx_image_name,
                            "tx_number": oldData.tx_number,
                            "tx_type": oldData.tx_type,
                            "id": oldData.id
                        }]
                    });
                } else {
                    newArr[index].res.push({
                        "tx_create_time": oldData.tx_create_time,
                        "tx_image_url": oldData.tx_image_url,
                        "tx_image_name": oldData.tx_image_name,
                        "tx_number": oldData.tx_number,
                        "tx_type": oldData.tx_type,
                        "id": oldData.id
                    });
                }
            });
            return newArr;
        };
        console.log(mapLoction(arr));


        var scrollElement = document.querySelector('.page'),
            viewH = document.documentElement.clientHeight;

        function lazyload() {
            var nodes = document.querySelectorAll('img[data-src]');
            Array.prototype.forEach.call(nodes, function (item, index) {
                var rect;
                if (item.dataset.src === '') return;
                rect = item.getBoundingClientRect();
                if (rect.bottom >= 0 && rect.top < viewH) {
                    (function (item) {
                        var img = new Image();
                        img.onload = function () {
                            item.src = img.src;
                        }
                        img.src = item.dataset.src;
                        item.dataset.src = '';
                    })(item)
                }
            })
        }

        function throttle(fun, delay, time) {
            var timeout,
                startTime = new Date();
            return function () {
                var context = this,
                    args = arguments,
                    curTime = new Date();
                clearTimeout(timeout);
                if (curTime - startTime >= time) {
                    fun.apply(context, args);
                    startTime = curTime;
                } else {
                    timeout = setTimeout(fun, delay);
                }
            };
        };

        $(function () {
            //动态加载元素时写在这里面更保险一些
            lazyload();
            //scrollElement为图片外面的父元素
            scrollElement.addEventListener('scroll', throttle(lazyload, 500, 1000));

        })
    </script>
</body>

</html>